<template>
  <div class="SchoolStudent">
    <div class="studentItem" v-for="item in studentlist" :key="item.id">
      <img :src="`https://ss.lanqb.com/${item.avatar}`" alt="" />
      <p>
        <b>{{ item.name }}</b>
        {{ item.content }}
      </p>
    </div>
  </div>
</template>

<script>
export default {
  name: "SchoolStudent",

  data() {
    return {
      studentlist: [],
    };
  },

  mounted() {},
  async created() {
    const {
      data: { data },
    } = await this.$http({
      methods: "GET",
      url: "	/lqb/api/school/testimoniales",
      params: {
        limit: 3,
      },
    });
    this.studentlist = data;
    console.log(this.studentlist);
  },
  methods: {},
};
</script>

<style lang="scss" scoped>
.SchoolStudent {
  width: 100vw;
  background-color: white;
  padding: 10px;
  display: flex;
  flex-direction: column;
  .studentItem {
    width: 100vw;
    height: 92px;
    display: flex;
    > img {
      width: 71px;
      height: 71px;
    }
    > p {
      width: 276px;
      height: 72px;
      font-size: 12px;
      overflow: hidden;
      -webkit-line-clamp: 4;
      line-height: 18px;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-box-orient: vertical;
    }
  }
}
</style>
